<template>
  <div style="height: 100%">
    <div id="printMe">
<!--      <el-header>
        <h1 style="text-align: center">评定表名称：{{ assessname }}</h1>
      </el-header>-->
      <el-main>
        <el-row style="display:flex;justify-content: center;height: auto">
          <div >
            <h1>创建时间为{{createTime}}</h1>
            <el-row type="flex" justify="center">
              <el-col :span="24">
                <!-- 评定表名称 -->
                <el-row type="flex" justify="center" align="middle" style="border: 1px dashed #cccccc;border-radius: 10px;height: 80px;">
                  <el-col :span="23">
                    <div class="grid-content">
                      <span>评定表名称：</span>
                      <el-input v-model="assessname" placeholder="输入评定表名称" style="width: 85%;"/>
                    </div>
                  </el-col>
                </el-row>
                <el-row type="flex" justify="start" align="middle" style="margin-top: 10px;text-align: left;">
                  <el-col>
                    <div class="grid-content" style="line-height: 36px;">
                      <span>基本情况</span>
                    </div>
                  </el-col>
                </el-row>
                <!-- 姓名、性别、年龄、科室、患者编号 -->
                <el-row type="flex" justify="space-between" align="middle" style="border: 1px dashed #cccccc;border-radius: 10px;height: 80px;">
                  <el-col :span="4" :offset="1">姓名:
                    <el-input style="width: 60%;"></el-input>
                  </el-col>
                  <el-col :span="4">性别:
                    <el-input style="width: 60%;"></el-input>
                  </el-col>
                  <el-col :span="4">年龄:
                    <el-input style="width: 60%;"></el-input>
                  </el-col>
                  <el-col :span="4">科室:
                    <el-input style="width: 60%;"></el-input>
                  </el-col>
                  <el-col :span="5">患者编号:
                    <el-input style="width: 50%;"></el-input>
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
<!--            <componentAll></componentAll>-->
            <div>
              <div :style="{float : (isdouble == true ? 'left' : ''),width: (isdouble == true ? '50%' : '')}" style="margin: 50px auto 0 auto;height: auto;pointer-events: none;" >
                <el-form  ref="pgForm" label-width="80px">

                  <div v-for="assname in comList" :assname="assname" style="margin:10px 0">
                    <keep-alive>
                      <component
                        :is="assname"
                        :istrans="true"
                        :fromdata="fromdata[0].assessData[assname]"
                      ></component>
                    </keep-alive>
                  </div>
                </el-form>
              </div>

              <div  v-if="isdouble" >
                <div style="float:right;margin-top:50px;width:auto;width: 50%;height: auto;pointer-events: none;" >
                  <el-form  ref="pgForm" label-width="80px">
                    <div v-for="assname in comList" :assname="assname" style="margin:10px 0">
                      <keep-alive>
                        <component
                          :is="assname"
                          :istrans="true"
                          :fromdata="fromdata[1].assessData[assname]"
                        ></component>
                      </keep-alive>
                    </div>
                  </el-form>
                </div>
              </div>
            </div>

          </div>

        </el-row>
      </el-main>
    </div>
    <el-footer style="display: flex;justify-content: center;">
      <el-button style="height:50px " type="primary" @click="fanhui">返 回</el-button>
      <el-button v-print="'#printMe'" type="primary" style="height:50px ">打印</el-button>
    </el-footer>
  </div>
</template>

<script>
import {getAssess} from "@/api/gaoxin/assess";
import data_show from "@/views/gaoxin/patient/data_show";
import {getTask} from "@/api/gaoxin/taskdata";
import componentAll from "@/views/components/assesscoms/componentAll";
import {listData} from "@/api/gaoxin/data";
export default {
  name: "datas_show",
  components:{
    data_show,
    componentAll
  },
  created() {

    const taskId = this.$route.params.taskId;
    listData({taskId: taskId}).then(response => {
      const taskData = response.rows;
      console.log(taskData);
      this.fromdata[0] = taskData[0];
      console.log(this.fromdata[0]);
      var temp1=this.fromdata[0].assessData;
      var reg=/\\/g;
      let replaceAfter = temp1.toString().replace(reg,'');
      this.fromdata[0].assessData=JSON.parse(replaceAfter)
      this.createTime = this.fromdata[0].createTime;
    });

    getTask(this.$route.params.taskId).then(res=>{
      this.assessname=res.data.assessName
      console.log(this.assessname)
      this.assessId = res.data.assessId;
      this.comList = JSON.parse(this.taskdata.assessConfig);
      console.log('this.comList',this.comList)
    })
  },
  data() {
    return {
      taskId:"",
      isdouble:false,
      // 数据项
      fromdata: [],
      assessname: "",
      assessId: "",
      assdata: [],
      assess: [],
      comList: [],
      pat:{},
      createTime: ''
    }
  },
  methods: {
    fanhui(){
      this.$tab.closePage();
      this.$router.go(-1);
    },
    quzhuanyi() {
      var temp1 = this.fromdata[0].assessData;
      // console.log(String.toString(temp))
      var reg=/\\/g;
      let replaceAfter = temp1.toString().replace(reg,'');
      this.fromdata[0].assessData = JSON.parse(replaceAfter)
      if(this.isdouble){
        var temp1=this.fromdata[1].assessData;
        // console.log(String.toString(temp))
        var reg=/\\/g;
        let replaceAfter = temp1.toString().replace(reg,'');
        this.fromdata[1].assessData = JSON.parse(replaceAfter)
      }
    },
    getass() {
      getAssess(this.assessId).then(res => {
        this.assess = res.data;
        console.log('assess:',this.assess)
        this.comList = this.assess.assessConfig.split(',')
        console.log('comList:',this.comList)
      })
    }
  }
}
</script>

<style>
.el-header{
  /*background-color: #B3C0D1;*/
  color: #333;
  text-align: center;
  line-height: 60px;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}
.el-footer{
  text-align: center;
  line-height: 60px;
  width: 100%;
  /*height: ;*/
  bottom: 0;/*始终距离它的父元素的底部为0px.则是处于父元素的最底*/
}

.el-aside {
  /*background-color: #D3DCE6;*/
  color: #333;
  text-align: center;
  line-height: 200px;
}

.el-main {
  /*background-color: #E9EEF3;*/
  color: #333;
  height: auto;
  /*line-height: 160px;*/
}

body > .el-container {
  margin-bottom: 40px;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
}


</style>
